<template>
  <div class="recomend">
    <a
      @click="
        $router.push({
          path: '/type',
          query: { categoryId: item.categoryId, active: index },
        })
      "
      class="box"
      v-for="(item, index) in recomend"
      :key="item.name"
    >
      <img :src="item.iconUrl" alt="" />
      <span class="mt-10 f16">{{ item.name }}</span>
    </a>
  </div>
</template>

<script>
// import { getList } from "@api/category.js";
// import { get } from "@/request/index";
export default {
  data() {
    return {
      // recomend: [],
    };
  },
  props: ["recomend"],
  created() {
    // this.getList();
  },
  methods: {
    // getList() {
    // get('/product')
    // getList()
    //   .then((res) => {
    //     console.log(res);
    //     this.recomend = res.list;
    //   })
    //   .catch((err) => {
    //     console.log(err);
    //   });
    // },
  },
};
</script>

<style scoped>
.recomend {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
}
.recomend .box {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 25%;
  height: 95px;
  margin: 10px 0;
}
.recomend .box img {
  height: 45px;
  width: 45px;
}
</style>